

.fetch__list{
  padding: 20px;
  display: flex;
  gap: 20px;
  flex-direction: column;
}

.fetch__list-item{
  background-color: var(--info-colour);
  padding: 20px;
  border-radius: 5px;
  display: flex;
  gap: 15px;

  > button{
    background-color: var(--background-colour);
  }
}

.fetch__list-item-type{
  font-weight: bold;
  font-size: 1.125rem;
}

.fetch__type-select{
  font-size: 1.5rem;
}

.fetch__list-item-info {
  display: flex;
  gap: 10px;
  flex-direction: column;
}

.fetch__list-item-destination{
  display: flex;
  align-items: flex-end;
  gap: 5px;

  &::before{
    font-family: GamePocket;
    content: "@face00@";
    font-variant-ligatures: discretionary-ligatures;
    font-size: 1.5rem;
  }
}

.fetch__status {
  place-self: center center;
  text-align: center;
  border-radius: 5px;
  font-size: 1.25rem;
  padding: 10px;
  margin-inline-start: auto;
}


.fetch__status--none{
  background-color: var(--red-colour);
}

.fetch__status--partial{
  background-color: rgb(177 133 44);
}

.fetch__status--complete{
  background-color: var(--green-colour);
}

.fetch__new{
  display: flex;
  gap: 20px;
}

.fetch__new-content{
  display: flex;
  gap: inherit;
  flex-direction: column;
  overflow: auto;
}

.fetch__folder-picker{
  display: flex;
  gap: 20px;
  justify-content: space-between;
  align-items: stretch;
}

.fetch__text-input{
  display: flex;
  flex-direction: column;
  gap: 10px;

  > input {
    font-size: 1rem;
    padding: 5px 10px;
  }
}

.fetch__folder-picker-value{
  box-sizing: border-box;
  font-size: 1.25rem;
  background-color: rgb(255 255 255 / 20%);
  display: flex;
  align-items: center;
  padding-inline: 10px;
  cursor: pointer;
  flex-grow: 1;
}

.fetch__folder-button{
  flex-basis: 25%;
}

.fetch__list-input-list{
  appearance: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.fetch__list-input-list-item{
  appearance: none;
  margin: 0;
  border-radius: 5px;
  background-color: rgb(255 255 255 / 20%);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: 20px;
  padding-block: 5px;
  gap: 15px;
}

.fetch__list-input-add{
  display: flex;
  gap: 20px;
  width: 50%;

  > * {
    flex-basis: min-content;
    font-size: 1rem;
  }

  > input {
    flex-grow: 1;
    padding-inline: 10px;
  }
}

.fetch__archive-check{
  width: 100%;
  text-align: center;
  font-size: 1.25rem;
}

.fetch__close-button{
  margin-block-start: auto;
}
